<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Insert title here</title>
        {load: __PUBLIC__/JQuery/jquery-1.4.4.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.core.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.widget.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.button.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.dialog.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.mouse.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.position.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.resizable.js}
        {load: __PUBLIC__/JQuery/ui/jquery.ui.selectable.js}
        {load: __PUBLIC__/JQuery/ui/jquery.effects.core.js}
        {load: __PUBLIC__/css/grid.css}
        {load: __PUBLIC__/JQuery/themes/base/jquery.ui.all.css}
        <script type="text/javascript">
            $(document).ready(function()
            {
                //JQuery codes here
                //JQuery is the auxiliary controller
                var isin=true;
                $('#main').hide();
                $('#radio').buttonset();
                $('#inout').buttonset();
                $('#radio').css("font-size", '13px');
                $("#inout").css("font-size", "13px");
                $('#request').button();
                $("#request").css("font-size", "13px");
                $("#submi").button();
                $("#tocheck").buttonset();
                $("#search").button().click(function(){
                    var username = $("#keyword").val();
                    var type;
                    $("#selectable").children("tr")
                    if($("#radio6").attr("checked"))type = 1;
                    else type = 2;
                    $.post("/TDX/index.php?s=/User/jsonUser",{"username":username,"type":type},function(data){
                        data = data.data;
                        for(i=0;i<data.length;i++)
                        {
                            var tmp = $("#tabletemplate").clone();
                            tmp.find("#tUID").text(data[i].UID);
                            tmp.find("#tUserName").text(data[i].username);
                            tmp.find("#tTrueName").text(data[i].truename);
                            tmp.css("display", "table-row");
                            $("#selectable").append(tmp);
                        }
                        $("#selectable").selectable();
                    },'json');
                });
                $("#dialog-form").dialog({
                    autoOpen:   false,
                    height:         480,
                    width:          400,
                    modal:          true,
                    buttons:        {
                        "保存": function(){
                            var uid = $("#selectable").children().eq($(".ui-selected").first().index()).find("td").first().text();
                            $("#UID").attr("value", uid);
                            $(this).dialog("close");
                        },
                        "取消": function(){
                            $(this).dialog("close");
                        }
                    },
                    close: function(){
                        allFields.val("").removeClass("ui-state-error");
                    }
                });
                $('#radio').change(function(){
                    $(this).children().filter(':radio').each(function(){
                        if($(this).attr('checked'))
                        {
                            $('div#main').show();
                            $('div#main').children('div').each(function(){
                                $(this).hide();
                            });
                            $('#inout').show();
                            $("div#"+$(this).attr('id')).show();
                            $('div#main').children('p').text($(this).next().text());
                        }
                    });
                });
                $('#request').click(function(){
                    $("#dialog-form").dialog("open");
                });
                $("#submi").click(function(){
                    var sel;
                    var OID = $("#UID").val();
                    if($("#radio1").attr("checked"))sel=1;
                    else if($("#radio2").attr("checked"))sel=2;
                    else sel=3;
                    var amount = $("#amount"+sel).val();
                    var remark = $("#remark"+sel).val();
                    if($("#radio5").attr("checked"))amount = -amount;
                    var hash = $("form").serializeArray();
                    hash = hash[1].value;
                    $.post("/TDX/index.php?s=/Fund/ajaxModify",{
                        "type":sel,
                        "amount":amount,
                        "remark":remark,
                        "operID":OID,
                        "__hash__":hash
                    }, function(data){
                        var info = data.info;
                        alert(info);
                    }, "json");
                });
                $("#amount1").change(function(){
                    $.get("/TDX/index.php?s=/Fund/ajaxGetValue",{},function(data){
                        var per = parseFloat(data);
                        $("#parts").attr("value", (parseFloat($("#amount1").val())/per));
                    });
                });
            });
        </script>
        <!-- Insert the CSS Codes here -->
        <style type="text/css">
            p{
                vertical-align:top;
            }
            #feedback { font-size: 1.4em; }
            #selectable .ui-selecting { background: #FECA40; }
            #selectable .ui-selected { background: #F39814; color: white; }
            #selectable { list-style-type: none; margin: 0; padding: 0; width: 60%; }
            #selectable li { margin: 3px; padding: 0.4em; font-size: 0.8em; height: 18px; }
        </style>
    </head>
    <!--The followings are contents of the page-->
    <body>
        <div class="column grid_6">
            <form>
                <div id="radio">
                    <input type="radio" id="radio1" name="radio" ><label for="radio1">用户申购/赎回</label>
                    <input type="radio" id="radio2" name="radio" ><label for="radio2">财务收入/支出</label>
                    <input type="radio" id="radio3" name="radio" ><label for="radio3">投资收入/支出</label>
                </div>
            </form>
            <div id="main" class="titlecolumn grid_6" style="text-align:left;margin-left: 1em">
                <p class="smalltitle"></p>
                <div id="inout">
                    <input type="radio" id="radio4" name="inout" checked='checked'><label for="radio4">收入</label>
                    <input type="radio" id="radio5" name="inout"><label for="radio5">支出</label>
                </div>
                <div id="radio1">
                    <p>申购人UID：<input type="text" name="UID" id="UID">&nbsp;可点"选择..."查找<input type="button" id="request" value="选择..." style="padding-left:1em"></p>
                    <p>申购金额：<input type="text" name="amount" id="amount1"></p>
                    <p>申购份额：<input disabled="true" type="text" name="parts" id='parts'></p>
                    <p>申购备注：<textarea cols="20" name="remark" id="remark1" rows="4"></textarea></p>
                </div>
                <div id="radio2">
                    <p>请填写数额：<input type="text" name="amount" id="amount2"></p>
                    <p>财务收支备注：<textarea cols="20" name="remark" id="remark2" rows="4"></textarea></p>
                </div>
                <div id="radio3">
                    <p>请填写数额：<input type="text" name="amount" id="amount3"></p>
                    <p>投资收支备注：<textarea cols="20" name="remark" id="remark3" rows="4"></textarea></p>
                </div>
                <input style="margin-left: 30px" type="button" id="submi" value="提交">
            </div>
        </div>
        <div id="dialog-form" title="查询用户UID">
            <form>
                <fieldset>
                    按照
                    <div id="tocheck">
                        <input type="radio" id="radio6" name="tocheck" checked='checked' value="1"><label for="radio6">用户名</label>
                        <input type="radio" id="radio7" name="tocheck" value="2"><label for="radio7">真实姓名</label>
                    </div>
                    查找<br/>
                    <p><input type="text" id="keyword" name="keyword"><input type="button" id="search" name="search" value="查找"></p>
                    <input type="hidden" name="out" value="1">
                    <br/>
                    <table>
                        <tr width="300">
                            <th width="80">UID</th>
                            <th width="120">用户名</th>
                            <th width="100">真实姓名</th>
                        </tr>
                        <tbody id="selectable" style="text-align:center;font-size:12px">
                            <tr id="tabletemplate" class="ui-widget-content" style="display:none">
                                <td id="tUID" style="width:80px"></td>
                                <td id="tUserName" style="width:120px"></td>
                                <td id="tTrueName" style="width:100px"></td>
                            </tr>
                        </tbody>
                    </table>
                </fieldset>
            </form>
        </div>
    </body>
</html>